import React from 'react';
import { Layout } from 'antd';
import { Outlet, Routes, Route } from 'react-router-dom';
import Sidebar from '../../components/layout/Sidebar';
import { systemMenu } from '../../constants/systemMenus';
import Overview from './Overview';
import LogManagement from './LogManagement';
import InterfaceLog from './InterfaceLog';
import ResourceMonitor from './ResourceMonitor';
import ServiceMonitor from './ServiceMonitor';
import './styles.css';

const System: React.FC = () => {
  return (
    <Layout className="system-layout">
      <Sidebar menuItems={systemMenu} basePath="/system" />
      <Layout.Content className="system-content">
        <Routes>
          <Route index element={<Overview />} />
          {/* 日志管理路由 */}
          <Route path="operation-log" element={<LogManagement />} />
          <Route path="interface-log" element={<InterfaceLog />} />
          
          {/* 运行监测管理路由 */}
          <Route path="resource-monitor" element={<ResourceMonitor />} />
          <Route path="service-monitor" element={<ServiceMonitor />} />
          <Route path="risk-monitor" element={<div>系统运行风险监测</div>} />
          
          <Route path="*" element={<Outlet />} />
        </Routes>
      </Layout.Content>
    </Layout>
  );
};

export default System; 